const myData = {
    _tableArr: [],
    init() {},
    bindEvent() {
        this.add();
        this.getTableList('users/queryAll');
        this.delete();
    },
    getTableList: function(url) {
        myData._tableArr[0] = $('#myTable').DataTable({
            language: {
                url: "/libs/dataTables/Chinese.json"
            },
            lengthChange: true,
            searching: false,
            destroy: true,
            serverSide: true,
            pageLength: 10,
            pageSize: 1000,
            ordering: false,
            serverSide: true, //启动后台分页(必开启)
            processing: true,
            dom: 'rt<"bottom"iflp><"clear">',
            ajax: function(data, callback, settings) {

                $.ajax({
                    type: "get",
                    url: url,
                    async: true,
                    success: function(res) {
                        console.log("res----", res);
                        var returnData = {};
                        if (res.status == 200 && res.count > 0) {
                            returnData.recordsTotal = res.count;
                            returnData.recordsFiltered = res.count;
                            returnData.data = res.list; //返回的数据列表
                        } else {
                            returnData.recordsTotal = 0;
                            returnData.recordsFiltered = 0;
                            returnData.data = []; //返回的数据列表
                        }
                        callback(returnData);
                    },
                    error: function(e) {
                        console.log(e)
                    }
                });
            },
            columns: [{
                    data: "",
                    defaultContent: "",
                    render: function(data, type, meta, targets) {

                        return targets.row + 1
                    }
                },
                {
                    data: "",
                    defaultContent: "",
                    render: function(data, type, meta, targets) {
                        return '<a href="detail?id=' + meta.id + '"  class="detail" data-id="' + meta.id + '">' + meta.name + '</a>'
                    }
                },
                {
                    data: "age",
                    defaultContent: ""
                },
                {
                    data: "fileUrl",
                    defaultContent: ""
                },
                {
                    data: "id",
                    defaultContent: "",
                    render: function(data, type, meta, targets) {
                        return '<a class="del" data-id="' + data + '"><i class="iconfont icon-shanchu"></i></a>'
                    }
                }

            ],
            fnDrawCallback: function(oSettings) {}
        });
    },
    add() {
        $('.btn').on('click', function() {
            var res = {};
            res.name = $('#firstname').val();
            res.age = $('#lastname').val();
            $.ajax({
                type: 'get',
                url: 'users/add',
                data: res,
                success: function(res) {
                    myData._tableArr[0].ajax.reload();
                },
                error: function(err) {
                    console.log(err)
                }
            })
        })
    },
    delete() {
        $(document).delegate('.del', 'click', function() {
            var id = $(this).attr('data-id');
            $.ajax({
                type: 'get',
                url: 'users/delete',
                data: { id: id },
                success: function(res) {

                    myData._tableArr[0].ajax.reload();
                },
                error: function(err) {
                    console.log(err)
                }
            })
        })

    }
}
myData.init();
myData.bindEvent();